<template>
  <div class="flex-col-start box" style="width: 100%;background-color: white">
    <IndexCarousel></IndexCarousel>


    <IndexApartmentBox></IndexApartmentBox>
    <H1 class="body-item" style="color: #4c4c4c">您的下一站是哪里？</H1>
    <div class="body-item flex-col-center" >
      <CityBox style="width: 80%"></CityBox>
    </div>


    <H1 class="body-item" style="color: #4c4c4c">不确定自己要寻找什么样的住宿？</H1>


    <H1 class="body-item" style="color: #4c4c4c">激发留学的生活灵感</H1>


    <H1 class="body-item" style="color: #4c4c4c">用优质的服务，为您寻找海外理想的家</H1>





  </div>

</template>

<script>
import ApartmentCard from "@/components/card/ApartmentCard.vue";
import TransButton from "@/components/button/TransButton.vue";
import CityBox from "@/components/box/CityBox.vue";
import Carousel from "@/views/index/IndexCarousel.vue";
import IndexCarousel from "@/views/index/IndexCarousel.vue";
import IndexApartmentBox from "@/views/index/IndexApartmentBox.vue";

export default {
  name: "Body",
  components:{IndexApartmentBox, IndexCarousel, Carousel, CityBox, TransButton, ApartmentCard},
  data() {
    return {



    }
  },
  methods: {}
}
</script>

<style scoped lang="less">
.box{


  .body-item{
    width: 100%;
    margin-top: 50px;
  }


}
</style>